<template>
  <div id="nav">
    <van-tabbar v-model="active">
      <van-tabbar-item icon="home-o" to="/">首页</van-tabbar-item>
      <van-tabbar-item icon="gift-card-o">专题</van-tabbar-item>
      <van-tabbar-item icon="apps-o" to="/category">分类</van-tabbar-item>
      <van-tabbar-item icon="shopping-cart-o" to="/buycart">购物车</van-tabbar-item>
      <van-tabbar-item icon="setting-o">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  data () {
    return {
      active: 0
    }
  },
  mounted () {
    // console.log(this)
    switch (this.$route.path) {
      case '/category':
        this.active = 2
        break
      case '/':
        this.active = 0
        break
      case '/buycart':
        this.active = 3
        break
      default:
        this.active = 0
    }
  }
  // watch: {
  //   $route: function () {
  //     console.log('123')
  //     switch (this.$route.path) {
  //       case '/category':
  //         this.active = 2
  //         break
  //       case '/':
  //         this.active = 0
  //         break
  //       default:
  //         this.active = 0
  //     }
  //   }
  // }
}
</script>

<style lang="less" scoped>
</style>
